<!--
**********************************************************
* @Author: 张小平
* @Date:   2024-05-01
* @Email:  qqshuqian@163.com
* @Last modified: 最后修改日期
* @Description: 文件描述
**********************************************************
-->
<template>
  <div class="third">
    <div class="box">

      <i v-show="thirdLogins.includes('qq')" class="iconfont icon-QQ"
         @click="handleClick('qq')"
         style="color:#53a4d8"></i>
      <i v-show="thirdLogins.includes('wx')" class="iconfont icon-weixinicon2x"
         @click="handleClick('wx')"
         style="color:#71c252"></i>
      <i v-show="thirdLogins.includes('dd')" class="iconfont"
         @click="handleClick('dd')"
         style="color:#c73420">
        <svg-icon icon-name="icon-dingding"></svg-icon>
      </i>
      <!--      <i class="iconfont icon-weibo"-->
      <!--         @click="handleClick('wb')"-->
      <!--         style="color:#c73420"></i>-->
      <!--      <i class="iconfont icon-zhifubao"-->
      <!--         @click="handleClick('zfb')"-->
      <!--         style="color:#439fe2"></i>-->
      <!--      <i class="iconfont  icon-huaban88"-->
      <!--         @click="handleClick('gitee')"-->
      <!--         style="color:#666"></i>-->
    </div>



  </div>

  <el-dialog :title="扫码"   v-model="visible" >
    <div>
      <qrcode-vue
              class="qrcode-code"
              level="H"
              :size="128"
              :value="QRImgUrl"
      />
    </div>
  </el-dialog>


</template>

<script>
  import {renderAuth} from '@/framework-core/api/login'
  import QrcodeVue from 'qrcode.vue';
  import website from '@/framework-core/config/website';
  import SvgIcon from "@/framework-core/components/iconfont/SvgIcon.vue";
  export default {
    name: "thirdLogin",
    components: {
      SvgIcon,
      QrcodeVue
    },
    data() {
      return {
        QRImgUrl: '',
        thirdLogins:website.thirdLogins,
        visible:false
      }
    },
    methods: {
      getQRcode(QRlink){
        this.QRImgUrl= QRlink
        this.visible = true;
      },
      handleClick(thirdpart) {
        renderAuth(thirdpart).then(res => {
          debugger
          if(res.data.success){
            if(thirdpart=="wx") {
              if (window.isMobile) {
                window.location.href = res.data.data.data.url;
              } else {
                this.getQRcode(res.data.data.data.url)
              }
            }else{
              window.location.href = res.data.data.data.url;
            }

          }else{
            this.$message.success(res.data.message);
          }
        })
      }
    }
  };
</script>

<style lang="scss" scoped>
  .third {
    padding: 10px 0;
    .box {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    i {
      font-size: 36px;
      margin: 0 10px;
    }
  }
</style>
